<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
       <label for="">用户名</label>
        <input type="text" placeholder="请输入用户名"> <span id='showMsg'></span>
       <!-- <button>点击</button> -->
    
</body>
</html>

<script>
    //获得input元素对象
  let inputObj = document.getElementsByTagName('input')[0];
//document.getElementsByTagName('button')[0].onclick=()=>{
  
    //console.log(inputObj.value);
    //inputObj.value='萨达水';
//}

/*
   表单事件： onfocus 获得焦点事件
              onblur: 失去焦点
            onchange : 改变事件（只有内容发生并失去焦点时 触发该事件）  
*/
//获得焦点
inputObj.onfocus=()=>{
    console.log('onfocus');
}
//失去焦点
inputObj.onblur=()=>{
    console.log('onblur');
}




</script>